<template>
	<view class="snowy-form container top-fixed-button-container">
		<view class="smart-form">
		<uni-forms ref="dynamicFormRef" :rules="rules" :model="dynamicFormData" label-width="auto" label-align="left" style="{ paddingTop: buttonHeight + 'px' }">
			<snowy-dyna-field v-for="(item, index) in formSchema" :key="index" :index="index"
				:fieldConfig="item" :formData="dynamicFormData" />
		</uni-forms>
		<view class="smart-form-submit smart-margin-top20 bottom-button top-fixed-button">
		  <button class="smart-form-submit-btn smart-margin-right20" type="default" @click="cancel">取消</button>
		  <button class="smart-form-submit-btn" type="warn" @click="reset">重置</button>
		  <button class="smart-form-submit-btn" type="primary" @click="ok">保存</button>
		</view>
		</view>
	</view>
</template>

<script setup>
	import dynaApi from '@/api/dev/dyna.js'
	import userCenterApi from '@/api/sys/user-center-api'
	import {
		reactive,
		ref
	} from "vue"
	// 按钮的高度（单位：px），可以根据实际情况调整
	const buttonHeight = 50;
	// 动态表单
	const dynamicFormRef = ref()
	const formSchema  = ref([])
	const dynamicFormData = ref({})
	const moduleCode = ref('sale')
	const businessCode = ref('bill')
	dynaApi.getFormSchemas({
		moduleCode: moduleCode.value,
		businessCode: businessCode.value
	}).then(data => {
		formSchema.value = data || []
	})
	//校验规则
	const rules = reactive({})
	
	
	
	//保存
	const submit = () => {
		dynamicFormRef.value.validate().then(res => {
			userCenterApi.userUpdateUserInfo({
				...dynamicFormData.value
			}).then(data => {
				
			})
		})
	}
</script>

<style lang="scss" scoped>
	.top-fixed-button-container {
	  position: relative;
	  height: 100vh;
	}
	
	.top-fixed-button {
	  position: fixed;
	  top: 0;
	  left: 0;
	  right: 0;
	  width: 100%;
	  height: 50px; /* 确保与 buttonHeight 一致 */
	  background-color: #7A5AFF;
	  color: white;
	  text-align: center;
	  line-height: 50px;
	  z-index: 1000; /* 确保按钮在其他内容之上 */
	}
	
	.page-content {
	  padding-top: 50px; /* 确保页面内容不会被按钮遮挡 */
	  box-sizing: border-box;
	  height: 100%;
	}
	
	.content-item {
	  padding: 10px;
	  border-bottom: 1px solid #ccc;
	}
</style>